import React from 'react';
import { connect } from 'dva';
import { Link, routerRedux } from 'dva/router';
import { createForm } from 'rc-form';
import cx from 'classnames';
import { WingBlank, WhiteSpace, Flex, List, Button, Toast } from 'antd-mobile';
import styles from '../scale/styles.less';
import { SCALE_TCM, SCALE_TCM_C } from 'const';
// 界面的更改 (之前的是下一页下一页的), 现在是只显示一页.
// 科研版体质辨识需要判断男性题目和女性题目

function ScaleTemplate({ dispatch, location, form, scalevalue, detail, ...rest }) {
  let questions;
  const { getFieldProps, getFieldValue, setFieldsValue, validateFields, getFieldError } = form;
  const { state, query } = location;
  const { Item } = List;
  const { type, patientid, patientvalue } = location.state;
  let step = location.state.step;

  let Remarks = "";
  Remarks = "男性：身高（cm）-105=标准体重；女性：身高（cm）-100=标准体重（正常范围为标准体重±10%）";
  if(state.gender == 1 ){
      questions = SCALE_TCM_C;
      questions[0].subject[0].Remarks = Remarks;

  }else{
      questions =SCALE_TCM;
      questions[0].subject[0].Remarks = Remarks;
  }

  let scores = scalevalue[0] || [];

  function isDisable(name, value, i){
    if (detail && detail.patientValue) {
      let patientdetail = detail.patientValue.split(",");
      for (var i = patientdetail.length - 1; i >= 0; i--) {
        if(patientdetail[i] === name){
          return true;
        }
      }

    }

    return false;
  }
  function isActive(key, value, i) {
    if (detail && detail.patientValue) {
      return detail.patientValue.split('')[i] === value;
    }
    if (Array.from(scores).find(item => item === key)) {
      return true;
    }

    if (!getFieldValue(key)) {
      return false;
    }

    return getFieldValue(key) === value;
  }

  return (
    <WingBlank size="md">
        <WhiteSpace size="md" />
        {questions.map((question, id) => (
          <div>
          <List>
            <Item>
              {question.title}
            </Item>
          {question.subject.map((question, i) => (
              <List.Item wrap multipleLine key={question.id}>
                {`${i + 1}. ${question.title}`}
                <List.Item.Brief>
                  <Flex wrap="wrap" className={styles.questionOptions}>
                    {question.item.map((option, ii) => {
                      const key = option.id;
                      const value = option.title;
                       return (
                          <label key={key} 
                          className={cx(styles.questionOption, styles.questionOptionNormal, { [styles.questionOptionActive]:  isDisable(key, value, i), })}>
                            <input {...getFieldProps(`${key}`)} type="checkbox" name={key} value={value} checked={isActive(key, value, i)}/>
                            {value}
                          </label>
                        );
                    })}
                  </Flex>
                </List.Item.Brief>
                <div>{question.Remarks}</div>
              </List.Item>
            ))}
          </List>
          <WhiteSpace size="lg" />
            </div>
        ))}
    </WingBlank>
  );
}

export default connect(({ scale }) => ({ ...scale }))(createForm()(ScaleTemplate));
